<template>
	<el-container direction="vertical">
		<SearchForm :columns="formColumn" @search="search" @reset="search" />
		<el-header>
			<div class="left-panel">
				<el-button type="primary" @click="exportData">
					导出查询项
				</el-button>
			</div>
			<div class="right-panel"></div>
		</el-header>
		<el-main class="nopadding">
			<scTable
				ref="table"
				row-key="id"
				v-bind="list"
				stripe
				:setUpType="false"
        :vritualData="vritualData"
			>
				<el-table-column type="selection" width="50"></el-table-column>
        <el-table-column
				  label="操作"
				  fixed="right"
				  align="center"
				  width="200"
			  >
				  <template #default="scope">
				  	<el-button type="primary" plain size="small" @click="curriculaVariable(scope.row)">
              选课
            </el-button>
				  	<el-button type="warning" plain size="small" @click="divideIntoClasses(scope.row)">
              分班
            </el-button>
				  </template>
        </el-table-column>
				<template #studentName="scope">
					<el-link
						:underline="false"
						type="primary"
						:href="`#/teach/package/detail/${scope.row.id}`"
						>{{ scope.row.studentName }}</el-link>
				</template>
			</scTable>
		</el-main>
  </el-container> a
</template>

<script setup>
import SearchForm from "@/components/SearchForm/index.vue";
import { ref, reactive, getCurrentInstance } from 'vue'
import { formColumn, column } from "./date";
import { ElMessage } from 'element-plus'
const { proxy } = getCurrentInstance()
const list = reactive({
	apiObj: proxy.$API.student.list,
	params: {},
	column,
})
const vritualData = ref([
  {name: "张三"}
])
const table = ref(null)
function search(searchParams) {
	const params = Object.assign({}, list.params, searchParams);
	table.value.reload(params);
}
function curriculaVariable(row) {}
function divideIntoClasses(row) {}
// 导出查询项
function exportData() {
	const tableSelection = table.value.tableSelection;
	const isOk = tableSelection.length > 0 ? true : false
	if (isOk) {
		console.log("导出");
	}
	ElMessage({
		message: isOk ? "导出成功" : "请选择学员",
		type: isOk ? "success" : "warning"
	})
}
</script>

<style lang="scss" scoped>

</style>